<template>
	<view>
		<mescroll-body ref="mescrollRef" :down="downOption" :up="upOption" beforeEndDelay="2000" @init="mescrollInit"
			@down="downCallback">
			<view class="card">
				<view class="head">
					<view style="display: flex;" v-if="token!=''">
						<view style="width: 119upx;height: 119upx;">
							<u-avatar v-if="UserInfo.usertx" :src="UserInfo.usertx" shape="square" size="119upx" @click="upimg()"></u-avatar>
						</view>
						<view class="texts">
							<view class="myname">
								<view>
									<u-text v-if="UserInfo.nickname" :text="UserInfo.nickname" bold></u-text>
								</view>
								<view style="margin-left: 8rpx;width: 145rpx;height: 18rpx;"
									v-if="UserInfo.vip==true">
									<u-image src="/static/my/vip3.png" height="16" width="74"
										mode="heightFix"></u-image>
								</view>
							</view>
							<view>
								<u-text v-if="UserInfo.signature" :text="UserInfo.signature" color="info"></u-text>
							</view>
						</view>
					</view>
					<view style="display: flex;" v-else @click="GoMy()">
						<view style="width: 119upx;height: 119upx;">
							<u-avatar src="/static/common/appview.png" shape="square" size="119upx"></u-avatar>
						</view>
						<view class="texts">
							<view class="myname">
								<view>
									<u-text text="暂未登录" size="20" bold></u-text>
								</view>
							</view>
							<view>
								<u-text text="未登录请登录享受功能" color="info"></u-text>
							</view>
						</view>
					</view>
					
					<view v-if="UserInfo.sign!=null">
						<u-button v-if="UserInfo.sign==true" text="已签到"
							customStyle="width:119upx;height:66upx;border-radius:30rpx;" color="#aa55ff"></u-button>
						<u-button v-else text="签到" customStyle="width:119upx;height:66upx;border-radius: 30rpx;"
							color="#aa55ff" @click="UserSign()"></u-button>
					</view>
				</view>
			</view>
			<view class="tabs">
				<view class="mytab">
					<view>
						<u-text v-if="UserInfo.vip===true" color="#ff0000" :text="UserInfo.viptime"
							align="center" bold></u-text>
						<u-text v-else color="#ff0000" text="已过期" align="center" bold></u-text>
					</view>
					<view style="margin-top: 18rpx;">
						<u-text text="会员到期" align="center"></u-text>
					</view>
				</view>
				<view class="mytab">
					<view>
						<u-text v-if="!UserInfo.money" color="#ff5500" text="0" align="center" bold></u-text>
						<u-text v-else color="#ff5500" :text="UserInfo.money" align="center" bold
							@click="GoFenList()"></u-text>
					</view>
					<view style="margin-top: 18rpx;">
						<u-text text="我的积分" align="center"></u-text>
					</view>
				</view>
			</view>
			<view class="gard">
				<view class="gards">
					<view class="onegard" @click="GoShop()">
						<u-image width="30" height="30" src="/static/my/shop.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="在线商城"></u-text>
						</view>
					</view>
					
					<view class="onegard" @click="GoCard()">
						<u-image width="30" height="30" src="/static/my/kami.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="使用卡密"></u-text>
						</view>
					</view>
					<view class="onegard" @click="GoShopList()">
						<u-image width="30" height="30" src="/static/my/order.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="我的订单"></u-text>
						</view>
					</view>
					<view class="onegard" @click="GoYaoqing()">
						<u-image width="30" height="30" src="/static/my/yqhy.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="邀请好友"></u-text>
						</view>
					</view>
					<view class="onegard" @click="GoEdit()">
						<u-image width="30" height="30" src="/static/my/editzl.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="编辑资料"></u-text>
						</view>
					</view>
					<view class="onegard" @click="GoChangeword()">
						<u-image width="30" height="30" src="/static/my/mm.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="修改密码"></u-text>
						</view>
					</view>
					<view class="onegard" @click="Error()">
						<u-image width="30" height="30" src="/static/my/jifens.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="系统设置"></u-text>
						</view>
					</view>
					<view class="onegard" @click="JoinQun()">
						<u-image width="30" height="30" src="/static/my/jy.png"></u-image>
						<view style="margin-top: 10rpx;">
							<u-text text="官方客服"></u-text>
						</view>
					</view>
				</view>
			</view>
			<view class="cardcd round-12 shadow-1">
				<u-cell-group :border="false">
					<u-cell title="系统设置" isLink :border="false" icon="/static/my/set.png" size="large" @click="Error()">
					</u-cell>
					<u-cell title="检测更新" isLink :border="false" icon="/static/my/up.png" size="large"
						@click="getAppInfo()">
					</u-cell>
					<u-cell title="服务协议" isLink :border="false" icon="/static/my/kf.png" size="large" @click="Goxy()">
					</u-cell>
					<u-cell title="隐私政策" isLink :border="false" icon="/static/my/pay.png" size="large" @click="Goys()">
					</u-cell>
					<u-cell v-if="UserInfo.nickname!=null" title="退出登录" isLink :border="false"
						icon="/static/my/exit.png" size="large" @click="OutLogin()">
					</u-cell>
				</u-cell-group>
			</view>
		</mescroll-body>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>
<script>
	import {
		checkUpdate
	} from "../../components/yzhua006-update/js/app-update-check.js";
	import API from '../../util/request.js';
	import user from '../../store/modules/user';
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import { userInfo } from "os";
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				token: '',
				UserInfo: '',
				msg: 0,
				qunkey: '',
				downOption: {
					use: true, // 是否启用下拉刷新; 默认true
					auto: false, // 是否在初始化完毕之后自动执行下拉刷新的回调; 默认true
					native: false, // 是否使用系统自带的下拉刷新; 默认false; 仅mescroll-body生效 (值为true时,还需在pages配置enablePullDownRefresh:true;详请参考mescroll-native的案例)
					autoShowLoading: false, // 如果设置auto=true(在初始化完毕之后自动执行下拉刷新的回调),那么是否显示下拉刷新的进度; 默认false
					isLock: false, // 是否锁定下拉刷新,默认false;
					offset: 70, // 在列表顶部,下拉大于80upx,松手即可触发下拉刷新的回调
					inOffsetRate: 1, // 在列表顶部,下拉的距离小于offset时,改变下拉区域高度比例;值小于1且越接近0,高度变化越小,表现为越往下越难拉
					outOffsetRate: 0.2, // 在列表顶部,下拉的距离大于offset时,改变下拉区域高度比例;值小于1且越接近0,高度变化越小,表现为越往下越难拉
					bottomOffset: 20, // 当手指touchmove位置在距离body底部20upx范围内的时候结束上拉刷新,避免Webview嵌套导致touchend事件不执行
					minAngle: 45, // 向下滑动最少偏移的角度,取值区间  [0,90];默认45度,即向下滑动的角度大于45度则触发下拉;而小于45度,将不触发下拉,避免与左右滑动的轮播等组件冲突;
					beforeEndDelay: 400, // 延时结束的时长 (显示加载成功/失败的时长, android小程序设置此项结束下拉会卡顿, 配置后请注意测试)
					bgColor: "#ff7708", // 背景颜色 (建议在pages.json中再设置一下backgroundColorTop)
					textColor: "#ffffff", // 文本颜色 (当bgColor配置了颜色,而textColor未配置时,则textColor会默认为白色)
					textInOffset: '下拉刷新', // 下拉的距离在offset范围内的提示文本
					textOutOffset: '释放更新', // 下拉的距离大于offset范围的提示文本
					textLoading: '加载中 ...' // 加载中的提示文本
				},
				upOption: {
					use: false, // 是否启用上拉加载; 默认true
					auto: false, // 是否在初始化完毕之后自动执行上拉加载的回调; 默认true
					isLock: false, // 是否锁定上拉加载,默认false;
				}
			}
		},
		onBackPress() {
			this.$nextTick(() => {
				this.GetUserInfo();
			})
		},
		onLoad() {
			this.qunkey = uni.getStorageSync('qqgroup');
			this.token = uni.getStorageSync('Token');
			console.log(this.UserInfo)
		},
		onShow() {
			this.$nextTick(() => {
				this.GetUserInfo();
			})
		},
		mounted() {
			this.$nextTick(() => {
				this.GetUserInfo();
			})
		},
		methods: {
			onload(e) {
				console.log("onload");
			},
			onclose(e) {
				console.log("onclose: " + e.detail);
			},
			onerror(e) {
				console.log(e);
			},
			downCallback() {
				this.NewUserInfo()
			},
			getAppInfo() {
				var that = this;
				const system_info = uni.getSystemInfoSync();
				let params = {
					os: system_info.platform //本机设备操作系统  （android || ios）
				}
				if (params.os != 'ios' && params.os != 'android') false; //如果不是安卓或ios 返回false
				uni.request({
					url: API.GetAppUpdate(),
					success: (res) => {
						var data = JSON.parse(that.AES.decrypt(res.data, API.JmKey(), API.JmIv()));
						// console.log(res)
						let update_info = data
						checkUpdate(update_info, 1).then(res => {
							if (res.msg) {
								plus.nativeUI.toast(res.msg);
							}
						});
					}
				})
			},
			upimg() {
				var t = this;
				let token = uni.getStorageSync('Token');
				let user = uni.getStorageSync('User');
				uni.chooseImage({
					count: 1,
					sizeType: ["compressed"],
					sourceType: ["album"],
					success: function(e) {
						uni.showLoading({
							title: '正在上传..'
						})
						var o = e.tempFilePaths[0];
						uni.uploadFile({
							url: API.UploadHead() + user+'&usertoken='+token,
							filePath: o,
							name: "file",
							success: (res) => {
								console.log(token)
								var data = JSON.parse(t.AES.decrypt(res.data, API.JmKey(), API.JmIv()));
								console.log(data)
								if (data.code == 200) {
									uni.showToast({
										title: '头像上传成功'
									});
									uni.hideLoading();
									t.NewUserInfo();
								} else {
									uni.showToast({
										title: '头像上传失败',
										icon: 'none'
									});
									uni.hideLoading();
								}
							},
						});
					}
				});
			},
			JoinQun() {
				plus.runtime.openURL(
					'mqqopensdkapi://bizAgent/qm/qr?url=http%3A%2F%2Fqm.qq.com%2Fcgi-bin%2Fqm%2Fqr%3Ffrom%3Dapp%26p%3Dandroid%26k%3D' +
					this.qunkey);
			},
			GoYaoqing() {
				uni.navigateTo({
					url: '/pages/my/invite'
				})
			},
			GoShop() {
				uni.navigateTo({
					url: '/pages/shop/shop'
				})
			},
			Goys() {
				uni.navigateTo({
					url: `/pages/commen/webview?url=https://tool.freeapks.cn/tk/yszc.html`
				})
			},
			Goxy() {
				uni.navigateTo({
					url: `/pages/commen/webview?url=https://tool.freeapks.cn/tk/fwxy.html`
				})
			},
			Error: function() {
				this.$refs.uToast.show({
					type: 'error',
					message: '暂未开发',
				})
			},
			NewUserInfo: function() {
				var that = this;
				that.token = uni.getStorageSync('Token');
				let token = uni.getStorageSync('Token');
				let user = uni.getStorageSync('User');
				if (token !== null && token !== '') {
					uni.request({
						url: API.GetUserInfo() + user,
						success: (res) => {							
							var data = JSON.parse(this.AES.decrypt(res.data, API.JmKey(), API.JmIv()));
							// console.log(data)
							if (data.code == 400) {
								uni.setStorageSync('SET_ISLOGIN', false);
								uni.removeStorageSync('Token');
								uni.removeStorageSync('User');
								uni.navigateTo({
									url: '/pages/account/login'
								})
							} else {
								that.UserInfo = '';
								that.UserInfo = data.data;
								that.mescroll.endSuccess(data.data)
							}
						}
					})
				} else {
					uni.navigateTo({
						url: '/pages/account/login'
					})
					that.mescroll.endSuccess()
				}
			},
			GetUserInfo: function() {
				var that = this;
				that.token = uni.getStorageSync('Token');
				let user = uni.getStorageSync('User');
				if (user !== null && user !== '') {
					uni.request({
						url: API.GetUserInfo() + user,
						success: (res) => {
							var data = JSON.parse(this.AES.decrypt(res.data, API.JmKey(), API
							.JmIv()));							
							if (data.code == 400) {
								uni.setStorageSync('SET_ISLOGIN', false);
								uni.setStorageSync('uservip', false);
								uni.removeStorageSync('Token');
								this.$refs.uToast.show({
									type: 'error',
									message: '未登录'
								})
							} else {
								that.UserInfo = ''
								that.UserInfo = data.data
								console.log(that.UserInfo)
							}
						}
					})
				} else {
					this.$refs.uToast.show({
						type: 'error',
						message: '未登录'
					})
				}
			},
			GoMy() {
				uni.navigateTo({
					url: '/pages/account/login'
				})
			},
			OutLogin: function() {
				console.log("用户点击退出了")
				uni.setStorageSync('SET_ISLOGIN', false);
				uni.removeStorageSync('Token');
				uni.removeStorageSync('User');
				this.UserInfo='';
				this.$refs.uToast.show({
					type: 'success',
					message: '已退出登录',
					complete() {
						uni.navigateTo({
							url: '/pages/account/login'
						})
					}
				})
			},
			UserSign: function() {
				var that = this;
				uni.showLoading({
					title: '正在签到..'
				})
				let user = uni.getStorageSync('User');
				uni.request({
					url: API.UserSign() + user ,
					success: (res) => {
						var data = JSON.parse(this.AES.decrypt(res.data, API.JmKey(), API
						.JmIv()));
						console.log(data)
						if (data.code == 200) {
							uni.hideLoading()
							that.$refs.uToast.show({
								type: 'success',
								message: data.msf,
								complete() {
									that.NewUserInfo()
								}
							})
						} else {
							uni.hideLoading()
							that.$refs.uToast.show({
								type: 'error',
								message: data.msf,
								complete() {
									that.NewUserInfo()
								}
							})
						}
					}
				})
			},
			GoChangeword: function() {
				uni.navigateTo({
					url: '/pages/account/changeword'
				})
			},
			GoShopList: function() {
				uni.navigateTo({
					url: '/pages/my/shoplist'
				})
			},
			GoFenList: function() {
				uni.navigateTo({
					url: '/pages/my/fenlist'
				})
			},
			GoCard: function() {
				uni.navigateTo({
					url: '/pages/my/card'
				})
			},
			GoEdit: function() {
				uni.navigateTo({
					url: '/pages/my/edit'
				})
			}
		}
	}
</script>
<style lang="scss">
	.card {
		height: 360rpx;
		padding: 30rpx;
		background-image: url('../../static/my/mybg.png');
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}

	.head {
		margin-top: 120rpx;
		display: flex;
		justify-content: space-between;
		height: 119upx;
		align-items: center;
		// background-color: #ffffff;
	}

	.texts {
		margin: 20upx 0;
		flex: 3;
		@include flex(column);
		justify-content: space-between;
		margin-left: 25rpx;
	}

	.myname {
		display: flex;
	}

	.tabs {
		margin: -100rpx 30rpx 30rpx 30rpx;
		display: flex;
		justify-content: space-between;
	}

	.mytab {
		width: 49%;
		padding: 40rpx 0;
		background-color: #ffffff;
		border-radius: 20rpx;
	}

	.gard {
		padding-top: 30rpx;
		margin: 30rpx;
		border-radius: 20rpx;
		background-color: #ffffff;
	}

	.gards {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		width: 100%;
	}

	.onegard {
		@include flex(column);
		width: 24%;
		box-sizing: border-box;
		align-items: center;
		margin-bottom: 30rpx;
	}

	.round-12 {
		border-radius: 20rpx;
	}

	.shadow-1 {
		box-shadow: 2rpx 1rpx 18rpx rgba(200, 200, 200, 0.1);
	}

	.cardcd {
		background-color: #ffffff;
		padding: 10rpx;
		margin: 0 30rpx;
	}
</style>